<template>
	<view class="pr">
		<!-- 	<u-image @click="$u.route('/pages/index/baijia/baijia')" src="/static/img/index/baojia.png" width="208"
			height="114" style="position: fixed;bottom: 300rpx; right: 0;"></u-image> -->
		<view class="baojia flex bg-fff" @click="$u.route('/pages/index/baijia/baijia')">
			<image src="/static/img/my/jdzs.png" class="w60 h60" mode="" />
			<view class="fw-w pr10">报价记录</view>
		</view>
		<image src="/static/img/index/bg.png" class="w-max pa" mode="widthFix" />
		<u-navbar :is-back="false" :border-bottom="false" title-bold :is-fixed="false"
			:background="{background:'#fff0'}">
			<view class="pr20 pl20 flex w-max">
				<view class="fs26 color-fff " @click="$u.route('/pages/index/chooseAddress/chooseAddress')">
					{{myAdd.name||'请选择地址'}}
				</view>
				<image src="/static/img/index/arr.png" class="h14 w14 ml10 mr20" mode=""></image>
				<u-search placeholder="点击搜索陪诊服务/医院/陪诊师" height="72" bg-color="#fff" class="flex1 " :show-action="false"
					:search-icon-color="$zs" v-model="keyword">
				</u-search>
			</view>
		</u-navbar>
		<view class="p20">
			<u-swiper :list="banner.banner" @click="$advJumpList(banner.banner,$event)" name="pic"></u-swiper>
			<!-- <image src="/static/img/index/invite.png" class="h170 mt20 w-max" mode="widthFix" 	@click="$u.route('/pages/my/menu/share')"></image> -->
			<image v-if="banner.advert&&banner.advert.pic" :src="banner.advert.pic" class="h170 mt20 w-max"
				mode="widthFix" @click="$advJump(banner.advert)"></image>

			<view class="text-center">
				<image src="/static/img/index/order.png" class="h44 w152 "></image>
			</view>
			<view class="mt24 bg-fff radius20">
				<view class="flex list radius20">
					<view class="flex h68  raduis-tab border-tab">
						<view v-for="(item,index) in tabList" :key="index" class="flex row-center pl48 pr48"
							:class="current==index?'on':''" @click="current=index">
							{{item.name}}
						</view>
					</view>
				</view>
				<view class="p20 pt0">
					<orderInfo :list="list" />
				</view>
			</view>
		</view>
		<z-company />
	</view>
</template>

<script>
	export default {
		computed: {
			tabList() {
				let aa = []
				if (this.$config.is_quote != 0) {
					aa.push({
						type: 0,
						name: '报价',
					})
				}
				aa.push({
					name: '一口价',
					type: 1,
				})
				return aa
			}
		},
		data() {
			return {
				myAdd: this.$getCache('myAdd') || '',
				current: 0, //当前选中导航tab 医院 陪诊师 陪诊机构
				banner: '',
				list: '',
				keyword: '',
			};
		},
		watch: {
			current(e) {
				this.getList()
			},
			keyword(e) {
				this.$u.debounce(this.getList, 500)
				// this.getList()
			},
		},
		onLoad() {

		},
		onShow() {
			this.myAdd = this.$getCache('myAdd') || ''
			if (!this.myAdd) {
				setTimeout(() => {
					this.$u.route('/pages/index/chooseAddress/chooseAddress')
				}, 10)
				return
			}
			this.getBanner()
			this.getList()
		},
		onReachBottom() {
			this.getList('down')
		},
		methods: {
			getBanner() {
				let params = {
					city_id: this.myAdd.id || "", //	整型	必填	-	-	城市id
				}
				this.$request('/master/index/banner', params).then(res => {
					this.banner = res.data
				})
			},
			getList(e) {
				e == 'down' ? this.page++ : this.page = 1
				let params = {
					page: this.page,
					city_id: this.myAdd.id || "", //	整型	必填	-	-	城市id
					keyword: this.keyword, //	字符串	非必填	-	-	搜索词
					type: this.tabList[this.current]?.type || 0, //	整型	必填	-	-	0=报价,1=一口价
				}
				// if (!params.city_id) return this.$msg('请选择地址')
				this.$request('/master/index/index', params).then(res => {
					let list = res.data.data
					e == 'down' ? this.list.push(...list) : this.list = list
				})
			},
		},
	}
</script>

<style lang="scss">
	.raduis-tab {
		border-radius: 20rpx 0px 30rpx 0px;
	}

	.border-tab {
		border: 1px solid #A6EAEC;
	}

	.list {
		background: linear-gradient(180deg, rgba(9, 199, 202, 0.18) 0%, rgba(255, 255, 255, 0) 100%);
	}

	.on {
		height: 100%;
		border-radius: 20rpx 0px 30rpx 0px;
		color: #FFFFFF;
		background: linear-gradient(180deg, #00C2CF 0%, #1ED2BE 100%);
	}

	/deep/ .u-dropdown__menu__item {
		justify-content: flex-start !important;
	}

	.bottom100 {
		bottom: 230rpx;
	}

	.baojia {
		position: fixed;
		right: 0;
		bottom: calc(var(--window-bottom) + 200rpx);
		border-radius: 100rpx 0 0 100rpx;
		padding: 6rpx;
		border: $zs 1px solid;
		border-right: none;
	}
</style>